<!DOCTYPE html >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>客户管理</title>
    <link href="../../css/style.css" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" src="../../js/jquery.js"></script>

    <!--    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>-->
    <script type="text/javascript" src="../../js/axios.js"></script>
    <script type="text/javascript" src="../../js/api.js"></script>
    <script type="text/javascript" src="../../layui/layui.js"></script>
    <script type="text/javascript" src="../../laydate/laydate.js"></script>
    <link href="../../layui/css/layui.css" rel="stylesheet" type="text/css"/>
    <link href="../../laydate/need/laydate.css" rel="stylesheet" type="text/css"/>

    <script type="text/javascript">
        function deltipOpen(id) {
            $("#deltip").fadeIn(200);
            //取消绑定事件
            $('#delSubmit').unbind('click');
            $('#delSubmit').click(function () {
                axiosJson('get', '/purchase/delPurchase', null, {purchaseId: id}).then((res) => {
                    loadPurchase(pageNum, pageSize, conn)
                })
            })
        }

        function deltipClose() {
            $("#deltip").fadeOut(200);
        }

        function examinetipOpen(id) {
            $("#examinetip").fadeIn(200);
            //取消绑定事件
            $('#auditSubmit').unbind('click');

            //提交页面审核点击事件
            $('#auditSubmit').click(() => {
                let uid = $('#staff').val();
                console.log(uid)
                axiosJson('get', '/purchase/auditUser', null, {uid: uid, purchaseId: id}).then((res) => {
                    console.log(res.data)
                    loadPurchase(pageNum, pageSize, conn)
                })
            })
        }

        function examinetipclose() {
            $("#examinetip").fadeOut(200);
        }
    </script>
    <style type="text/css">
        .dfselect {
            width: 200px;
        }

       form input {
            width: 150px;
        }
    </style>
</head>

<body>
<div class="place"><span>位置：</span>
    <ul class="placeul">
        <li>采购管理</li>
        <li>采购单管理</li>
        <li>基本内容</li>
    </ul>
</div>
<div class="rightinfo">
    <form id="conn" action="" method="post">
        <ul class="tools">
            <li> 采购单编号:
                <input name="purchaseId" type="text"/>
            </li>
            <li> 采购时间: <!--type="datetime-local" class="laydate-icon"-->
                <input name="purchaseTimeStart" type="text" id="time1"/>-<input name="purchaseTimeEnd" type="text"
                                                                                id="time2"/>
            </li>
            <li> 金额:
                <input name="totalMoneyStart" type="text" class="stinput"/>-<input name="totalMoneyEnd" type="text"
                                                                                   class="stinput"/>
            </li>
            <li> 审核状态：
                <select name="checkStatus">
                    <option value="0">请选择</option>
                    <option value="1">未审核</option>
                    <option value="2">审核中</option>
                    <option value="3">审核通过</option>
                    <option value="4">审核未通过</option>
                </select>
            </li> <!-- onclick="window.location.href='purchaseList.html'"-->
            <li class="subBut" id="query"><img src="../../images/t06.png"/>查询
            </li>
            <li class="subBut" onclick="window.location.href='purchaseAdd.html'"><img src="../../images/t01.png"/>添加
            </li>
        </ul>
    </form>
    <table class="tablelist">
        <thead>
        <tr>
            <th>序号</th>
            <th>采购单编号</th>
            <th>采购时间</th>
            <th>金额</th>
            <th>操作人</th>
            <th>审核状态</th>
            <th>审核人</th>
            <th>审核时间</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody id="managelist">
        <!--    <tr>
                <td>1</td>
                <td>CG201701270001</td>
                <td>2017-01-25 15:05:05</td>
                <td>￥9,876,582</td>
                <td>关羽</td>
                <td>未审核</td>
                <td></td>
                <td></td>
                <td>
                    <a href="purchaseUpdate.html" class="tablelink">修改</a>
                    <a href="javascript:void(0);" class="tablelink" onclick="deltipOpen()">删除</a>
                    <a href="javascript:void(0);" class="tablelink" onclick="examinetipOpen()">提交审核</a>
                </td>
            </tr>
            <tr>
                <td>2</td>
                <td>CG201701270002</td>
                <td>2017-01-25 15:05:05</td>
                <td>￥9,876,582</td>
                <td>关羽</td>
                <td>审核中</td>
                <td></td>
                <td></td>
                <td>
                    <a href="purchaseView.html" class="tablelink">查看详情</a>
                </td>
            </tr>
            <tr>
                <td>3</td>
                <td>CG201701270003</td>
                <td>2017-01-25 15:05:05</td>
                <td>￥9,876,582</td>
                <td>关羽</td>
                <td>审核通过</td>
                <td>曹操</td>
                <td>2017-01-30 12:05:05</td>
                <td>
                    <a href="purchaseView.html" class="tablelink">查看详情</a>
                    <a href="../../storage/stock/stockView.html" class="tablelink">入库详情</a>
                </td>
            </tr>
            <tr>
                <td>4</td>
                <td>CG201701270004</td>
                <td>2017-01-25 15:05:05</td>
                <td>￥9,876,582</td>
                <td>关羽</td>
                <td>审核不通过</td>
                <td>曹操</td>
                <td>2017-01-30 12:05:05</td>
                <td>
                    <a href="purchaseUpdate.html" class="tablelink">修改</a>
                    <a href="javascript:void(0);" class="tablelink" onclick="examinetipOpen()">提交审核</a>
                </td>
            </tr>-->
        </tbody>
    </table>

    <div class="pagin" id="page">
        <!-- <div class="message">共<i class="blue">1256</i>条记录，当前显示第&nbsp;<i class="blue">2&nbsp;</i>页</div>
         <ul class="paginList">
             <li class="paginItem"><a href="javascript:;"><span class="pagepre"></span></a></li>
             <li class="paginItem"><a href="javascript:;">1</a></li>
             <li class="paginItem current"><a href="javascript:;">2</a></li>
             <li class="paginItem"><a href="javascript:;">3</a></li>
             <li class="paginItem"><a href="javascript:;">4</a></li>
             <li class="paginItem"><a href="javascript:;">5</a></li>
             <li class="paginItem more"><a href="javascript:;">...</a></li>
             <li class="paginItem"><a href="javascript:;">10</a></li>
             <li class="paginItem"><a href="javascript:;"><span class="pagenxt"></span></a></li>
         </ul>-->
    </div>

    <!-- 删除提示框 -->
    <div id="deltip" class="tip">
        <div class="tiptop"><span>提示信息</span><a onclick="deltipClose()"></a></div>
        <div class="tipinfo"><span><img src="../../images/ticon.png"/></span>
            <div class="tipright">
                <p>是否确认删除此条信息？</p>
                <cite>如果是请点击确定按钮 ，否则请点取消。</cite></div>
        </div>
        <div class="tipbtn">
            <input name="" id="delSubmit" type="button" class="sure" value="确定" onclick="deltipClose()"/>
            &nbsp;
            <input name="" type="button" class="cancel" value="取消" onclick="deltipClose()"/>
        </div>
    </div>

    <!-- 审批提示框 -->
    <div id="examinetip" class="tip">

        <div class="tiptop">
            <span>提示信息</span><a onclick="examinetipclose()"></a>
        </div>
        <div class="tipinfo1">

            部门：
            <select class="dfselect" id="dept">
                <option value="0">--请选择--</option>
                <option value="1">董事会</option>
                <option value="2">采购部</option>
            </select>
            <p/>
            职位：
            <select class="dfselect" id="job">
                <option>--请选择--</option>
                <!--<option>部门经理</option>
                <option>部门副经理</option>
                <option>部门主管</option>-->
            </select>
            <p/>
            职员：
            <select class="dfselect" id="staff">
                <option>--请选择--</option>
                <!--    <option>刘备</option>
                    <option>曹操</option>-->
            </select>
            <p/>
        </div>
        <div class="tipbtn">
            <input name="" id="auditSubmit" type="button" class="sure" value="确定" onclick="examinetipclose()"/>
            &nbsp;
            <input name="" type="button" class="cancel" value="取消" onclick="examinetipclose()"/>
        </div>

    </div>
</div>
<script type="text/javascript">
    $('.tablelist tbody tr:odd').addClass('odd');

    let dept = ''
    let pageSize = 8;
    var conn = ''
    var pageNum = getParameter("pageNum") == null ? 1 : getParameter("pageNum");
    let cn = decodeURI(getParameter("condition"));
    conn = JSON.parse(cn) == null ? '' : JSON.parse(cn);
    $(function () {
        if (conn != '') {
            $("[name='purchaseId']").val(conn[0].value)
            $("[name='purchaseTimeStart']").val(conn[1].value)
            $("[name='purchaseTimeEnd']").val(conn[2].value)
            $("[name='totalMoneyStart']").val(conn[3].value)
            $("[name='totalMoneyEnd']").val(conn[4].value)
            $("[name='checkStatus']").val(conn[5].value)
        }
        loadPurchase(pageNum, pageSize, conn)
    })

    layui.use('laydate', function () {
        var laydate = layui.laydate;
        laydate.render({
            elem: '#time1'
            , type: 'datetime'
        });
        laydate.render({
            elem: '#time2'
            , type: 'datetime'
        });
    })
    // var start = {
    //     elem: '#time1',
    //     format: 'YYYY-MM-DD hh:mm:ss',
    //     max: '2099-06-16', //最大日期
    //     istime: true,
    //     istoday: false,
    //     choose: function(datas){
    //
    //     }
    // };
    //
    // laydate.skin('molv');//切换皮肤，请查看skins下面皮肤库
    // laydate(start);
    //加载数据
    function loadPurchase(pageNum, pageSize, conn) {
        axiosJson('get',//提交方法
            '/purchase/view',//提交地址
            conn,
            {pageNum: pageNum, pageSize: pageSize}
        ).then((res) => {
            writeListData(res, conn, pageNum)
            //提交审核绑定点击事件
            $("a[name='check']").click(function () {
                axiosRequest('get', '/purchase/toExamine', null).then((res) => {
                    dept = res.data.resultData;
                    writeAuditView(dept)
                })
            })
        })
    }

    //查询点击事件
    $('#query').click(function () {
        conn = $('#conn').serializeArray()
        loadPurchase(pageNum, pageSize, conn)
    })


    //写提交审核页面的数据
    function writeAuditView(dept) {
        let jobMap = {}
        let staffMap = {}
        jobMap[0] = [];
        staffMap["--请选择--"] = [];
        $.each(dept, (k1, v1) => {
            jobMap[k1] = [];
            $.each(v1, (k2, v2) => {
                jobMap[k1].push(k2);
                staffMap[k2] = v2;
            })
        })
        /*职位*/
        $('#dept').change(() => {
            let jobHtml = ``;
            jobHtml += `<option>--请选择--</option>`;
            let jobMapElement = jobMap[$("#dept").val()];
            $.each(jobMapElement, (k, v) => {
                jobHtml += `<option>` + v + `</option>`;
            })
            $("#job").html(jobHtml)
            $('#job').change()
        })
        /*职员*/
        $('#job').change(() => {
            let staffHtml = ``
            staffHtml += `<option value="0">--请选择--</option>`
            let staffMapElement = staffMap[$('#job').val()];
            $.each(staffMapElement, (k, v) => {
                staffHtml += `<option value="` + v.uId + `">` + v.uName + `</option>`
            })
            $('#staff').html(staffHtml)
        })
    }


    //写数据
    function writeListData(res, conn, pageNum) {
        let str = ''
        let manage = res.data.resultData.data  //pageModel里list的数据
        let page = res.data.resultData   //查看pageModel 的属性值
        var arr = ['未审核', '审核中', '审核通过', '审核未通过'];
        for (let i = 0; i < manage.length; i++) {
            let status = manage[i].checkStatus;
            for (let i = 0; i < arr.length; i++) {
                if (status == (i + 1)) status = arr[i]
            }
            let jump = ''
            if (status == '未审核') {
                jump += `<a href='purchaseUpdate.html?purchaseId=` + manage[i].purchaseId + `&condition=` + encodeURI(JSON.stringify(conn)) + `&pageNum=` + pageNum + `' class="tablelink">修改</a>\n` +
                    '   <a href="javascript:void(0);" class="tablelink" onclick="deltipOpen(\'' + manage[i].purchaseId + '\')">删除</a>\n' +
                    '   <a href="javascript:void(0);" class="tablelink" name="check"  onclick="examinetipOpen(\'' + manage[i].purchaseId + '\')">提交审核</a>'
            }
            if (status == '审核中') {
                jump += `<a href='purchaseView.html?purchaseId=` + manage[i].purchaseId + `&condition=` + encodeURI(JSON.stringify(conn)) + `&pageNum=` + pageNum + `' class="tablelink">查看详情</a>`
            }
            if (status == '审核通过') {
                jump += `<a href='purchaseView.html?purchaseId=` + manage[i].purchaseId + `&condition=` + encodeURI(JSON.stringify(conn)) + `&pageNum=` + pageNum + `' class="tablelink">查看详情</a>\n` +
                    '  <a href="../../storage/stock/stockView.html?purchaseId=' + manage[i].purchaseId + '&id='+manage[i].warehouseId +'" class="tablelink">入库详情</a>'
            }
            if (status == '审核未通过') {
                jump += `<a href='purchaseUpdate.html?purchaseId=` + manage[i].purchaseId + `&condition=` + encodeURI(JSON.stringify(conn)) + `&pageNum=` + pageNum + `' class="tablelink">修改</a>\n` +
                    '  <a href="javascript:void(0);" class="tablelink" name="check" onclick="examinetipOpen(\'' + manage[i].purchaseId + '\')">提交审核</a>'
            }
            str += ' <tr>\n' +
                '            <td>' + ((page.pageNum - 1) * page.pageSize + i + 1) + '</td>\n' +
                '            <td>' + manage[i].purchaseId + '</td>\n' +
                '            <td>' + manage[i].purchaseTime + '</td>\n' +
                '            <td>￥' + manage[i].totalMoney + '</td>\n' +
                '            <td>' + manage[i].creator.uName + '</td>\n' +
                '            <td>' + status + '</td>\n' +
                '            <td>' + (manage[i].checkUser == null || manage[i].checkUser === ''? '' : manage[i].checkUser.uName) + '</td>\n' +
                '            <td>' + (manage[i].checkTime == null ? '' : manage[i].checkTime) + '</td>\n' +
                '            <td>\n' + jump +
                '            </td>\n' +
                '        </tr>'
        }

        $('#managelist').html(str)
        $('.tablelist tbody tr:odd').addClass('odd');

        //页码显示
        layui.use("laypage", function () {
            var laypage = layui.laypage;
            laypage.render({
                elem: "page",                       //页码所放的位置
                theme: '#eb5409',
                count: page.totalCount,             //总记录数
                limit: page.pageSize,               //每页的数据
                limits: [5, 8, 12],                 //每页可访问的数据量
                curr: page.pageNum,                 //当前页
                layout: ['prev', 'page', 'next', 'limit', 'count', 'skip'],
                jump: function (obj, first) {
                    pageNum = obj.curr
                    pageSize = obj.limit
                    if (!first) {
                        loadPurchase(pageNum, pageSize, conn);
                    }
                }
            })
        })
    }


</script>
</body>
</html>
